<template>
	<view class="main_container" >
		<u-sticky bgColor="#ffffff">
		<u-row justify="center" customStyle="margin: 8px; border: 0.5px grey; border-radius: 20px;padding: 6px">
			<u-col span="12">
				<view>
					<u-grid :border="false" :col="5">
						<!-- <u-grid-item v-for="(item,index) in pannel_list" @click="handle(item.index_src, item.id, item.title)"> -->
						<u-grid-item v-for="i of forum_list" span="3" @click="handle(i.id)">
							<u--image :src="i.image_src" width="30px" height="30px" radius="5px" mode="aspectFit"></u--image>
							<text style="white-space: nowrap; font-size: 12px; color: #505256;padding-top: 5px;padding-bottom: 5px;">{{ i.title }}</text>
						</u-grid-item>
					</u-grid>
				</view>
			</u-col>
		</u-row>
		</u-sticky>
		<post-message v-for="cpost in post_id_list" :post="cpost" />
		<drag-button text="+" @btnClick="add_post"/>
		<kevy-empty :show="is_empty" text="暂无内容,快来发送吧~"></kevy-empty>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				offset: 0,
				is_empty: false,
				cur_id: null,
				forum_list: [],
				post_id_list: []
			}
		},
		onReachBottom() {
			this.load_posts(this.offset)
			.then(d => {
				d.forEach(oid => {
					this.post_id_list.push(oid)
					// if(this.post_id_list.length > 30){
					// 	this.post_id_list.shift()
					// }
				})
			})
		},
		async onLoad() {
			let cdata = await uni.request({
				url: getApp().globalData.base_url + "/get/forum_list"
			})
			
			this.forum_list = cdata.data
			
			this.cur_id = cdata.data[0].id
			
			await this.handle(this.cur_id)
		},
		methods: {
			async handle(id) {
				this.offset = 0
				this.cur_id = id
				this.post_id_list = []
				let cdata_posts_ids = await uni.request({
					url: getApp().globalData.base_url + "/get/post_message_list/"+ this.offset+"/" + id
				})
				this.post_id_list = cdata_posts_ids.data
				this.offset = cdata_posts_ids.data.length
				if(!cdata_posts_ids.data.length) {
					this.is_empty = true
				} else {
					this.is_empty = false
				}
			},
			add_post() {
				if (this.cur_id){
					uni.navigateTo({
						url: "/pages/new_post/new_post?id=" + this.cur_id
					})
				}
			},
			async load_posts() {
				let id_list 
				try{
					id_list = await uni.request({
						url: getApp().globalData.base_url + "/get/post_message_list/" + this.offset + "/" + this.cur_id
					})
					this.offset += id_list.data.length
					
				} catch(e) {
					throw e
				}
				
				return id_list.data
			}
		}
	}
</script>

<style>
	.main_container {
		padding-top: 20px;
	}
</style>
